<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/bootstrap.css" />
    <link rel="stylesheet" href="./css/bootstrapValidator.css" />
    <script type="text/javascript" src="./js/jquery.js"></script>
    <script type="text/javascript" src="./js/bootstrap.min.js"></script>
    <script type="text/javascript" src="./js/bootstrapValidator.js"></script>
    <script src="./js/language/zh_CN.js"></script>    <script src="https://cdn.jsdelivr.net/npm/qs@6.10.1/dist/qs.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
    <script src="./js/axiosPretreatment.js"></script>
    <script src="./js/check.js"></script>
    <link rel="stylesheet" href="./css/public.css">
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <div class="outer">
        <h1>
            <span>南海城市大脑</span>
            <p>渔业资源管理系统</p>
        </h1>

        <div class="loginWeaper">
            <div id="login">
                <div id="loginBypassWord">账号密码登录</div>
                <div id="loginByPhone">手机号登录</div>
            </div>
            <p id="line"><span></span></p>
            <form action="" method="post" class="passwordLogin">
                <div>
                    <span><img src="./img/indexImg/user.png" alt=""></span>
                    <input id="AccountNum" type="text" autocomplete="off" maxlength="11" placeholder="请输入账号或手机号码">
                    <span class="inputNum">0/11</span>
                </div>
                <div class="xWeaper">
                    <span><img src="./img/indexImg/password.png" alt=""></span>
                    <input id="passNum" type="password" autocomplete="off" placeholder="请输入密码">
                    <img class="x" src="./img/indexImg/x.png" alt="">
                </div>
                <button type="submit" id="btnLogin">
                    登录
                </button>
            </form>
            <form  class="phoneLogin">
                <div>
                    <span><img src="./img/indexImg/phone.png" alt=""></span>
                    <input id="phoneNum" type="text" autocomplete="off" maxlength="11" placeholder="请输入手机号码">
                    <span class="pPassNum">0/11</span>
                </div>
                <div class="verify">
                    <div>
                        <span><img src="./img/indexImg/password.png" alt=""></span>
                        <input id="verifyInput" autocomplete="off" type="text" placeholder="请输入验证码">
                    </div>
                    <i>获取验证码</i>
                </div>
                <button type="submit" id="btnPlogin">手机登录</button>
            </form>
            <p class="register" id="btnForgot">
                <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">忘记密码</button>
                <button id="toRegister">信息员注册</button>
            </p>

            <div class="QR-code">
                <img src="./img/indexImg/QRcode.png" alt="">
                <h5>手机端二维码</h5>
            </div>
        </div>
        <p class="ali">@copyright 2021 阿里云计算有限公司出品</p>
    </div>

    <!-- 按钮触发模态框 -->
    <!-- <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
	开始演示模态框
</button> -->
    <!-- 模态框（Modal） -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    忘记密码
                </h4>
            </div>
            <div class="modal-body">
                <div class="modal-dialog">
                    <div class="forgotWeaper">
                        <div>
                            <div class="inner">
                                <div>
                                    <span><i>*</i>手机号码</span>
                                        <input id="forgotPnum" maxlength="11" type="text" autocomplete="off">
                                        <span class="forgotSpan">0/11</span>
                                </div>

                                <div class="vNum">

                                    <span><i>*</i>验证码</span>
                                    <input id="verInput" type="text" autocomplete="off">
                                    <button>获得验证码</button>
                                </div>
                                <div>
                                    <span><i>*</i>密码</span>
                                     <input id="forgotPasswords" type="password" autocomplete="off">
                                </div>
                                <div class="affirmWeaper">
                                    <span><i>*</i>确认密码</span>
                                   <input id="affirm" type="password" autocomplete="off">
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal" id="close">关闭
                        </button>
                        <button id="amend" type="button" class="btn btn-primary">
                            修改
                        </button>
                    </div>
                </div>
            </div><!-- /.modal -->
        </div>
    </div>
    <!-- <script type="text/javascript" src="./js/jquery.js"></script> -->

        <script src="./js/isTrue.js"></script>
        <script src="./js/index.js"></script>

</body>

</html>